.contain{
    width: 100%;
    height: 100%;
    padding: 20px 16px ;
    background-color: #f0f2f5;
    color: #343639;
    font-size: 0.9vw;
    .topBox{
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 14vh;
        margin-bottom: 2vh;
        .topInfo{
           display: flex;
           flex-direction: column;
           justify-content: space-between;
           width: 19.2%;
           height: 100%;
           padding: 20px 13px 20px;
           background-color: #fff;
           border-radius: 10px;
           .numberBox{
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 1.3vw; //去numberCounter.tsx里设置
            font-weight: 600;
            word-break: break-all;
             span{
               font-size: 1vw;
               font-weight: 500;
             }
             .iconImg{
                width: 2vw;
                height: 2vw;
             }
           }
        }
    }
    .centerBox{
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 37.8vh;
        margin-bottom: 2vh;
        .centerLeft{
             width: 80%;
             height: 100%;
             background-color: #fff;
             border-radius: 10px;
             overflow: hidden;
             .echartBox{
                width: 66vw;
                height: 36vh;
                margin-top: 2vh;
             }
         }
        .centerRight{
            width: 19%;
            height: 100%;
            background-color: #fff; 
            border-radius: 10px;
            padding: 20px 15px 5px;
            .rankTitle{
                font-size: 1.03vw;
                font-weight: 600;
                height: 15%;
            }
            .rankBox{
                 width: 100%;
                 height: 85%;
                 display: flex;
                 flex-direction: column;
                 justify-content: space-between;
                 .rankInfo{
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    .rankName{
                      display: flex;
                      align-items: center;
                      font-size: 0.85vw;
                      font-weight: 445;
                      width: 65%;
                      .circle{
                      display: flex;
                      justify-content: center;
                      align-items: center;
                      width: 2.1vw;
                      height: 2.1vw;
                      margin-right: 5px;
                      border-radius: 50%;
                      color: #efa350;
                      font-size: 1vw;
                      font-weight: 500;
                      background-color: #fbe9ba;
                     }
                     .merchart{
                      width: 70%;
                      white-space: nowrap;
                      overflow: hidden;
                      text-overflow: ellipsis;
                     }
                    }
                    .rankNum{
                        flex: 1;
                        color: #aab1ba;
                        display: flex;
                        justify-content: right;
                    }
                 }
            }
        }
    }
    .bottomBox{
        height: 33vh;
        background-color: #fff;
        padding: 15px;
        .orderTitle{
            font-size: 1.03vw;
            font-weight: 600;
            margin-bottom: 2.1vh;
        }
    }
}
